/*
 * @Author: 李世千
 * @Date: 2021-04-23 20:37:42
 * @LastEditTime: 2021-04-26 16:35:13
 * @LastEditors: 李世千
 */
// /*
//评论组件
import { useEffect, useState } from 'react';
import { Form, Input, Button, Checkbox, Alert, message } from 'antd';
const { TextArea } = Input;
import useStore from '@/context/useStore';
import { observer } from 'mobx-react-lite';
import styles from '@/pages/layouts/Concerning/Concerning.less';
import React from 'react';
const Context = React.createContext({ name: 'Default' });

function Lmezt() {
  const [messsageApi, contextHolder] = message.useMessage();
  let { page } = useStore();
  //评论
  const onFinish = (errorInfo: any) => {
    //邮箱验证
    let patten = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
    if (!patten.test(errorInfo.email)) {
      return messsageApi.open({
        type: 'info',
        content: '输入合法邮箱地址，以便在收到回复时邮件通知',
        duration: 1,
      });
    } else {
      return (
        message.success('评论成功，已提交审核'),
        page.MessageTransfer({
          name: errorInfo.name,
          email: errorInfo.email,
          content: errorInfo.content,
          html: errorInfo.content,
          pass: false,
          userAgent: 'Chrome 89.0.4389.114  Windows  10  ',
          hostId: '8d8b6492-32e5-44e5-b38b-9a479d1a94bd',
          url: '/page/msgboard',
        })
      );
    }
  };

  return (
    <>
      <Context.Provider value={{ name: 'Ant Design' }}>
        {contextHolder}
      </Context.Provider>
      <Form
        className={styles.fields}
        initialValues={{ remember: true }}
        onFinish={onFinish}
      >
        <Form.Item name="content" className={styles.Text}>
          <textarea
            className={styles.Texts}
            rows={4}
            placeholder="输入合法邮箱地址，以便在收到回复时邮件通知"
          />
        </Form.Item>
        <div className={styles.zhong}>
          <Form.Item
            className={styles.items}
            name="name"
            rules={[{ required: false }]}
          >
            <Input className={styles.sec} placeholder="请输入您的称呼" />
          </Form.Item>

          <Form.Item
            className={styles.itemss}
            name="email"
            rules={[{ required:false }]}
          >
            <Input
              className={styles.secc}
              placeholder="请输入您的邮箱（不会公开，您也可以选择不输入）"
            />
          </Form.Item>
        </div>
        <div className={styles.sa}>
          <Form.Item rules={[{ required: true }]} className={styles.fiex}>
            <Button type="primary" htmlType="submit">
              评论
            </Button>
          </Form.Item>
        </div>
      </Form>
    </>
  );
}

export default observer(Lmezt);